<template>
  <view class="container">
    <view class="top">
      <image class="top-logo" src="@/static/images/logo.png"></image>
      <text class="top-title">捷虎 智能运维</text>
    </view>

    <view class="form">
      <view class="form-item">
        <input v-model="formData.userAccount"
               placeholder-class="form-item-input-placeholder" type="text"
               placeholder="登录名"
               class="form-item-input"/>
        <image class="form-item-icon" src="@/static/images/yonghuming.png"></image>
      </view>
      <view class="form-item">
        <input type="password" v-model="formData.userPsw"
               placeholder-class="form-item-input-placeholder"
               placeholder="登录密码"
               class="form-item-input"/>
        <image class="form-item-icon" src="@/static/images/mima.png"></image>
      </view>
    </view>

    <view class="btn">
      <view class="btn-name" @click="onLogin">登录</view>
    </view>
  </view>
</template>

<script setup>
import {onLoad} from "@dcloudio/uni-app";
import {setLocalStorage} from "/@/utils/util";
import {STORAGE_KEY} from "/@/config/constant";
import {reactive} from "vue"
import {loginApi} from "/@/api/login";

const formData = reactive({
  userAccount: 'testUser1',
  userPsw: '12345678',
  userid: 0,
  userLevel: 0,
})

onLoad(() => {
})

const onLogin = async () => {
  const flag = verifyForm()
  if (!flag) {
    return;
  }
  console.log(formData)
  let res = await loginApi(formData)
  if (res && res.data) {
    console.log('登录信息', res.data)
    setLocalStorage(STORAGE_KEY.userInfo, res.data);
    uni.reLaunch({
      url: "/pages/index/index"
    })
    uni.showToast({title: '登录成功', icon: 'none'})
  }else{
	uni.showToast({title: '登录失败', icon: 'none'})
  }

}

const verifyForm = () => {
  if (!formData.userAccount.trim()) {
    uni.showToast({title: '登录名不正确', icon: 'none'})
    return false
  }
  if (!formData.userPsw.trim()) {
    uni.showToast({title: '登录密码不正确', icon: 'none'})
    return false
  }
  return true
}
</script>

<style lang="scss" scoped>
@import "login";
</style>
